<%@ page pageEncoding="UTF-8" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %>

<%
    String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort()
            + request.getContextPath();
    request.setAttribute("basePath", basePath); // 将BasePath的内容保存在application属性之中
%>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title>DEMO</title>
    <link rel="stylesheet" href="../../css/bootstrap.min.css"/>
    <link rel="stylesheet" href="../../css/common.css"/>
    <link rel="stylesheet" href="../../css/welcome.css"/>
</head>
<body style="background: #FFFFFF;">
<!--遮罩层-->
<div class="zhy_zhezhao_pop " style="height:800px;"></div>
<!--遮罩层 end-->

<div class="zhy_popa deletepop">
    <p class="color66">提示</p>
    <div class="pop_content">
        <p>您确定要删除角色 <font class="colorblue" id="delRoleName"></font> 吗？</p>
        <div class="operate_btn pull-right">
            <button type="button" class="btn cancle_yes">确定</button>
            <button type="button" class="btn cancle_btn" onclick="hideEdit()">取消</button>
        </div>
    </div>
</div>

<!--删除账号信息弹出框-->
<div class="zhy_popa create_zh_s " style="width: 450px;margin-left: -225px;">
    <p class="color66">温馨提示<span class="pull-right close_icon" onclick="hideEdit()"></span></p>
    <div class="pop_content text-center">
        <p>尊敬的${name}，此角色已被相关账号使用，您暂时无法删除此角色。</span></p>
        <p>如需删除此角色，请先删除使用此角色的相关账号。</p>
        <div class="operate_btn pull-right">
            <button type="button" class="btn cancle_yes" onclick="hideEdit()">关闭</button>
        </div>
    </div>
</div>

<div class="main_content member_list">
    <div class="col-xs-12 col-sm-12 div_bordered">
        <div class="jkbg_title_boxab">角色管理</div>
        <div class="divider"></div>
        <div class="panel panel-default">
            <div class="panel-heading">
                <div class="site_change">
                </div>
                <form class="form-inline pl20" role="form" method="post" action="${basePath}/pages/role/listRoles.action" id="searchForm">
                    <input name="page" type="hidden" value=""/>
                    <div class="form-group">
                        <div class="search">
                            <input type="text" name="roleName" placeholder="请输入角色名称" value=""/>
                        </div>
                    </div>
                    <div class="form-group">
                        <button type="button" class="btn btn_white20" onclick="javascript:searchSub(0)"
                                id="role_search">搜索
                        </button>
                    </div>
                    <div class="pull-right text-right mr15">
                        <a class=" btn_blueg2 font14" href="${basePath}/pages/role/addRole.action">+添加角色</a>
                    </div>
                </form>
            </div>
            <table class="table table-bordered  table-hover table_fixed">
                <thead>
                <tr>
                    <th width="30%" class="border_right">角色名称</th>
                    <th width="40%" class="border_right">角色描述</th>
                    <th width="30%">操作</th>
                </tr>
                </thead>
                <tbody>
                <c:forEach items="${roleResult.list}" var="role">
                <tr class="nodata">
                    <td>${role.roleName}</td>
                    <td>${role.roleDesc}</td>
                    <td>
                        <a type="button" disabled class="colorred"
                         href="javascript:void(0)" id="role-${role.roleId}" data-role="${role.roleName}">
                        <span class="colorred"></span>&nbsp;删除</a></td>
                </tr>
                </c:forEach>
                </tbody>
            </table>
        </div>
        <div class="row text-center">
            <input type="hidden" id="pageRoleName"/>
            <div id="role_pagination" class="pagination"></div>
        </div>
    </div>
</div>
</div>
<script type="text/javascript" src="../../js/jquery-1.8.3.min.js"></script>
<script type="text/javascript" src="../../js/common.js"></script>
<script type="text/javascript" src="../../js/jquery.pagination.js"></script>

<script type="text/javascript">

    /**
     ** 删除选中数据
     */
    $("a[id^=role-]").each(function () {
        $(this).on("click", function () {
            var name = this.getAttribute("data-role");
            roleid = this.id.split("-")[1];
            deleteM(name, "deletepop", roleid);
        });
    });

    function showPopC(className, id) {
        $(".zhy_zhezhao_pop").show();
        var top = document.body.scrollTop || document.documentElement.scrollTop;
        var this_h = $("." + className).height();
        var win_h = ($('html', parent.document).height() - this_h - 100) / 2
        $(".zhy_zhezhao_pop").height($("html").height());
        var this_h = $("." + className).height();
        top = top + win_h;
        $("." + className).css("top", top).show().siblings(".zhy_popa").hide();
    }

    //显示弹框
    function deleteM(name, className, id) {
        showPopC( className, id);
        $("#delRoleName").html(name);
        $("." + className).find("button:first").attr("onclick", "delAccRole('" + id + "')");
    }

    // 隐藏弹框
    function hideEdit() {
        $(".zhy_zhezhao_pop").hide();
        $(".zhy_popa").hide();
    }

    /*分页 */
    var pageIndex = ${roleResult.pageNum==null?0:roleResult.pageNum}; // 当前页
    var pageSize = ${roleResult.pageSize==null?0:roleResult.pageSize}; //每页显示条数初始化，修改显示条数，修改这里即可
    var total = ${roleResult.totalCount==null?0:roleResult.totalCount}; // 总计数
    $(function () {
        if (total > 0) {
            initPage();
        }

        //全局捕获回车键
        document.onkeydown = keydown;

        function keydown(e) {
            var currKey = 0, e = e || event;
            currKey = e.keyCode || e.which || e.charCode;// 支持IE、FF
            if (currKey == 13) {
                $("#role_search").click();
            }
        }
    });

    // 有数据时分页
    function initPage() {
        //分页，PageCount是总条目数，这是必选参数，其它参数都是可选
        $("#role_pagination").pagination(total, {
            callback: PageCallback1,
            link_to: "javascript:searchSub(__id__)",
            prev_text: '上一页', //上一页按钮里text
            next_text: '下一页', //下一页按钮里text
            items_per_page: pageSize, //显示条数
            num_display_entries: 6, //连续分页主体部分分页条目数
            current_page: pageIndex - 1, //当前页索引
            num_edge_entries: 2			//两侧首尾分页条目数
        });

        //翻页调用
        function PageCallback1(index, jq) {
            return true;
        }
    }

    /*搜索*/
    function searchSub(no) {
        if (no == 0) {
            $("#searchForm input[name=page]").val(1);
            $("#searchForm").submit();
        } else {
            $("#searchForm input[name=page]").val(no + 1);
            $("#searchForm").submit();
        }
    }

    /********** 分页函数结束 **********/
    //删除用户角色
    function delAccRole(_roleId) {
        $.post(
            "${basePath}/pages/role/delRole",
            {'roleId': _roleId},
            function (data) {
                hideEdit();
                if (data=="1") {
                    zhyAlert("删除成功！");
                    window.location.href = "${basePath}/pages/role/listRoles";
                } else {
                    if (data=="2") {
                        showPopC("create_zh_s", undefined);
                        return;
                    }
                    zhyAlert("删除失败！");
                }
            },
            "json"
        );
    }
</script>
</body>